<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Task Management</title>
    <link rel="stylesheet" href="../../lib/bootstrap/3.3.5/css/bootstrap.min.css"/>
    <link rel="stylesheet" href="index.css">
</head>
<body class="container" id="app"> 
<div id="app" v-cloak>
  <h1>Routing Example App</h1>
  <div class="row">
    <div class="col-xs-4">
      <div class="list-group">
        <a class="list-group-item" v-link="/users/list">Users</a>
        <a class="list-group-item" v-link="/different">Different</a>
        <a class="list-group-item" v-link="/about">About</a>
        <a class="list-group-item" v-link="/you-cant-find-me">Not Found</a>
      </div>
    </div>
    <div class="col-xs-8">
      <div class="panel">
        <div class="panel-body">
          <router-view class="test" v-transition="test" transition-mode="out-in"></router-view>
        </div>
      </div>
    </div>
  </div>
</div>
    <script src="../../node_modules/vue/dist/vue.js"></script>
<script src="../../node_modules/vue-router/dist/vue-router.js"></script>
    <script src="index.js"></script>
</body>